<template>
  <entity-view
    :operator-type="operatorType"
    :model="beanInfo"
    @submit="submit"
    :rules="rules"
    ref="form"
  >
    <div class="subtitle">基本信息</div>
    <div class="sub-content-flex">
      <form-item
        label="代理机构代码"
        v-model="beanInfo.agentCode"
        prop="agentCode"
        disabled
      ></form-item>
      <form-item
        label="代理机构名称"
        v-model="beanInfo.agentName"
        prop="agentName"
      ></form-item>
      <form-item
        label="代理机构简称"
        v-model="beanInfo.agentSimpleName"
        prop="agentSimpleName"
      ></form-item>
      <form-item
        label="上级管理机构"
        v-model="beanInfo.manageInstId"
        prop="manageInstId"
        disabled
      >
      </form-item>
      <form-item
        label="机构证件类型"
        inputType="select"
        v-model="beanInfo.licenceType"
        prop="licenceType"
        :options="licenceTypeList"
        @change="(value) => handleChange(value, 'licenceType')"
      ></form-item>
      <form-item
        label="统一社会信用代码"
        v-model="beanInfo.licenceCode"
        prop="licenceCode"
        :maxLength="18"
      ></form-item>
      <form-item
        label="代理商法人姓名"
        v-model="beanInfo.artifName"
        prop="artifName"
        :maxLength="20"
      ></form-item>
      <form-item
        label="法人证件类型"
        inputType="select"
        v-model="beanInfo.artifCertType"
        prop="artifCertType"
        :options="artifCertTypeList"
        @change="(value) => handleChange(value, 'artifCertType')"
      ></form-item>
      <form-item
        label="法人证件编号"
        v-model="beanInfo.artifCertNo"
        prop="artifCertNo"
        :maxLength="32"
      ></form-item>
      <form-item
        label="法人手机号"
        v-model="beanInfo.artifMobile"
        prop="artifMobile"
        :maxLength="20"
      ></form-item>
      <form-item
        label="法人电子邮件"
        v-model="beanInfo.artifEmail"
        prop="artifEmail"
        :maxLength="64"
      ></form-item>
      <form-item
        label="代理商联系人姓名"
        v-model="beanInfo.contactName"
        prop="contactName"
        :maxLength="32"
      ></form-item>
      <form-item
        label="联系人电话"
        v-model="beanInfo.contactPhone"
        prop="contactPhone"
        :maxLength="20"
      ></form-item>
      <form-item
        label="联系人邮箱"
        v-model="beanInfo.contactEmaiil"
        prop="contactEmaiil"
        :maxLength="64"
      ></form-item>
      <form-item
        label="代理商邮编"
        v-model="beanInfo.postCode"
        prop="postCode"
        :maxLength="20"
      ></form-item>
      <form-item
        label="代理商地址"
        v-model="beanInfo.agentAddr"
        prop="agentAddr"
        :maxLength="128"
      ></form-item>
      <form-item
        label="是否全行可见"
        inputType="radioGroup"
        v-model="beanInfo.isShowAllFlag"
        prop="isShowAllFlag"
        :options="isShowAllFlagList"
        @change="(value) => handleChange(value, 'isShowAllFlag')"
      ></form-item>
      <form-item
        label="是否参与分润"
        inputType="radioGroup"
        v-model="beanInfo.isProfitFlag"
        prop="isProfitFlag"
        :options="isProfitFlagList"
        @change="(value) => handleChange(value, 'isProfitFlag')"
      ></form-item>
      <form-item
        label="分润规则"
        inputType="select"
        v-model="beanInfo.profitRule"
        prop="profitRule"
        :options="profitRuleList"
        v-if="beanInfo.isProfitFlag === '1'"
        @change="(value) => handleChange(value, 'profitRule')"
      ></form-item>
      <form-item
        v-if="beanInfo.profitRule === '01'"
        style="width: 100%"
        label="产品类型"
        inputType="checkbox"
        v-model="beanInfo.baseProdProfitConfListMap"
        prop="baseProdProfitConfListMap"
        :options="baseProdProfitConfListMap"
        @change="baseProdProfitConfListMapChange"
      ></form-item>
    </div>
    <div class="subtitle" v-if="beanInfo.profitRule === '00'">全产品统一分润</div>
    <div class="sub-content-flex" v-if="beanInfo.profitRule === '00'">
      <form-item
        label="分润类型"
        inputType="select"
        v-model="beanInfo.profitInputModeALL"
        prop="profitInputModeALL"
        :options="profitInputModeALLList"
        @change="(value) => handleChange(value, 'profitInputModeALL')"
      ></form-item>
      <form-item
        label="固定金额值"
        v-model="beanInfo.profitFixedAmtALL"
        prop="profitFixedAmtALL"
        :maxLength="16"
        v-if="beanInfo.profitInputModeALL === '01'"
      ></form-item>
      <form-item
        input-type="select"
        :options="feeCdList"
        label="固定金额费率模板"
        v-model="beanInfo.profitFixedIndexALL"
        prop="profitFixedIndexALL"
        @change="(value) => handleChange(value, 'profitFixedIndexALL')"
        v-if="beanInfo.profitInputModeALL === '01'"
      ></form-item>
      <form-item
        label="成本费率值"
        v-model="beanInfo.costFeeRateALL"
        prop="costFeeRateALL"
        :maxLength="7"
        v-if="beanInfo.profitInputModeALL === '03'"
      ></form-item>
      <form-item
        label="费率封顶值"
        v-model="beanInfo.costCappingAmtALL"
        prop="costCappingAmtALL"
        :maxLength="8"
        v-if="beanInfo.profitInputModeALL === '03'"
      ></form-item>
      <form-item
        label="分润比例"
        v-model="beanInfo.profitScaleALL"
        prop="profitScaleALL"
        :maxLength="7"
        v-if="beanInfo.profitInputModeALL === '02' || beanInfo.profitInputModeALL === '03'"
      ></form-item>
      <form-item
        label="分润封顶值"
        v-model="beanInfo.profitCappingAmtALL"
        prop="profitCappingAmtALL"
        :maxLength="16"
        v-if="beanInfo.profitInputModeALL === '02' || beanInfo.profitInputModeALL === '03'"
      ></form-item>
    </div>
    <form-item
      label="停用原因"
      v-model="beanInfo.stopReason"
      prop="stopReason"
      inputType="textarea"
      :maxLength="200"
      v-if="operatorType === 'view' || operatorType === 'stop'"
    ></form-item>
    <form-item
      label="注销原因"
      v-model="beanInfo.cancelReason"
      prop="cancelReason"
      inputType="textarea"
      :maxLength="128"
      :valid="operatorType==='cancel'"
      v-if="operatorType === 'view' || operatorType === 'cancel'"
    ></form-item>
    <div class="subtitle">结算信息配置</div>
    <div class="sub-content-flex">
      <form-item
        label="结算方式"
        inputType="select"
        v-model="beanInfo.settleType"
        prop="settleType"
        :options="settleTypeList"
        @change="(value) => handleChange(value, 'settleType')"
      ></form-item>
      <form-item v-if="beanInfo.settleType !== 'D0' && beanInfo.settleType !== 'T1'" label="结算周期" prop="settleCycle">
        <span>
          <span v-if="beanInfo.settleType === 'TN'">延迟</span>
          <span v-if="beanInfo.settleType === 'MT'">每月第</span>
          <span v-if="beanInfo.settleType === 'ST'">每季第</span>
          <a-input v-model="beanInfo.settleCycle" style="width: 100px" onkeyup="value=value.replace(/[^\d]+/g,'')"
                   onafterpaste="value=value.replace(/[^\d]+/g,'')"/>日
        </span>
      </form-item>
      <form-item
        label="结算账户类型"
        inputType="select"
        v-model="beanInfo.settleAcctType"
        prop="settleAcctType"
        :options="settleAcctTypeList"
        @change="(value) => handleChange(value, 'settleAcctType')"
      ></form-item>
      <form-item
        label="结算账号"
        v-model="beanInfo.settleAcctNo"
        prop="settleAcctNo"
        :maxLength="32"
      ></form-item>
      <form-item
        label="结算账户户名"
        v-model="beanInfo.settleAcctName"
        prop="settleAcctName"
        :maxLength="128"
      ></form-item>
      <form-item
        label="结算账号开户行号"
        inputType="select"
        v-model="beanInfo.acctOpenBankNo"
        prop="acctOpenBankNo"
        :options="acctOpenBankNoList"
        @change="bankNoChange"
        allowClear="true"
        :showSearch="true"
        @search="getBankNameCode"
      ></form-item>
      <form-item
        label="结算账号开户行名称"
        v-model="beanInfo.acctOpenBankName"
        prop="acctOpenBankName"
        disabled
      ></form-item>
    </div>
  </entity-view>
</template>
<script>
    import EntityView from "../../../../components/common/entityView/EntityView.vue";
    import FormItem from "../../../../components/common/entityView/FormItem.vue";

    export default {
        name: "AgentInfoOperation",
        components: {
            EntityView,
            FormItem,
        },
        props: {
            query: Object,
        },
        data: function () {
            return {
                instId: "",
                modalTitle: "",
                operatorType: "add",
                modalVisible: true,
                selectedRowKeys: [],
                beanInfo: {
                    agentCode: "",
                    manageInstId: "",
                    manageInstName: "",
                },
                rules: {
                    agentCode: [{required: true, message: "必填", trigger: "blur"}],
                    agentName: [{required: true, message: "必填", trigger: "blur"}, {max: 14, message: '不超过14位字符'}],
                    agentSimpleName: [{required: true, message: "必填", trigger: "blur"}],
                    manageInstId: [{required: true, message: "必填", trigger: "blur"}],
                    artifName: [{required: true, message: "必填", trigger: "blur"}],
                    artifCertType: [{required: true, message: "必填", trigger: "blur"}],
                    artifCertNo: [{required: true, message: "必填", trigger: "blur"},{ pattern: '^[a-zA-Z1-9][a-zA-Z0-9]{0,30}$', message: '请输入正确的证件号码' }],
                    artifMobile: [{required: true, message: "必填", trigger: "blur"},{pattern:'^1[3-9]{1}[0-9]{9}$', message: '请输入正确的手机号'}],
                    artifEmail: [{required: true, message: "必填", trigger: "blur"},{ type: 'email', message: '请输入正确的邮箱' },{ max: 64, message: '长度不能超过64个字符'}],
                    contactName: [{required: true, message: "必填", trigger: "blur"}],
                    contactPhone: [{required: true, message: "必填", trigger: "blur"},{pattern:'^1[3-9]{1}[0-9]{9}$', message: '请输入正确的联系人电话'}],
                    contactEmaiil: [{required: true, message: "必填", trigger: "blur"},{ type: 'email', message: '请输入正确的邮箱' },{ max: 64, message: '长度不能超过64个字符'}],
                    postCode: [{required: true, message: "必填", trigger: "blur"},{pattern:/^[0-9]{6}$/, message: '请输入正确的邮编'}],
                    agentAddr: [{required: true, message: "必填", trigger: "blur"}],
                    isShowAllFlag: [{required: true, message: "必填", trigger: "blur"}],
                    isProfitFlag: [{required: true, message: "必填", trigger: "blur"}],
                    profitRule: [{required: true, message: "必填", trigger: "blur"}],
                    profitInputModeALL: [{required: true, message: "必填", trigger: "blur"}],
                    profitFixedAmtALL: [{required: false, message: "必填", trigger: "blur"},{pattern:"^[0-9]+(.[0-9]{1,2})?$", message: '请输入正确的固定金额值值'}],
                    costFeeRateALL: [{required: true, message: "必填", trigger: "blur"},{pattern:"^[1-9]?[0-9]?[0-9](\.[0-9]{0,3})?$", message: '请输入正确的成本费率值'}],
                    costCappingAmtALL: [{required: true, message: "必填", trigger: "blur"},{pattern:"^[0-9]+(.[0-9]{1,2})?$", message: '请输入正确的费率封顶值'}],
                    profitScaleALL: [{required: true, message: "必填", trigger: "blur"},{pattern:"^[1-9]?[0-9]?[0-9](\.[0-9]{0,3})?$", message: '请输入正确的分润比例值'}],
                    profitCappingAmtALL: [{required: true, message: "必填", trigger: "blur"},{pattern:"^[0-9]+(.[0-9]{1,2})?$", message: '请输入正确的分润封顶值'}],

                    settleType: [{required: true, message: "必填", trigger: "blur"}],
                    settleAcctType: [{required: true, message: "必填", trigger: "blur"}],
                    settleAcctNo: [{required: true, message: "必填", trigger: "blur"}],
                    settleAcctName: [{required: true, message: "必填", trigger: "blur"}],
                    acctOpenBankNo: [{required: true, message: "必填", trigger: "blur"}],
                    acctOpenBankName: [{required: true, message: "必填", trigger: "blur"}],
                    stopReason: [{required: true, message: "必填", trigger: "blur"}],
                    cancelReason: [{required: true, message: "必填", trigger: "blur"}],
                },
                isShowAllFlagList: [
                    {value: "1", label: "是"},
                    {value: "0", label: "否"},
                ],
                isProfitFlagList: [
                    {value: "1", label: "是"},
                    {value: "0", label: "否"},
                ],
                loading: false,
                pageInfo: {},
                baseProdProfitConfListMap: {},
                licenceTypeList: [
                    {value: "00", name: "营业执照"},
                    {value: "01", name: "机构信用代码证"},
                    {value: "02", name: "民办非企业登记证书"},
                    {value: "03", name: "全国组织机构代码证"},
                    {value: "04", name: "事业单位法人证书"},
                    {value: "05", name: "境外企业证书"},
                    {value: "06", name: "社会团体法人登记证书"},
                    {value: "07", name: "工会法人资格证书"},
                    {value: "08", name: "政府批文"},
                    {value: "09", name: "预先核准通知书"},
                    {value: "10", name: "其他批文或证明"},
                    {value: "11", name: "贷款卡号"},
                    {value: "99", name: "其他"},
                ],
                artifCertTypeList: [
                    {value: "01", name: "身份证"},
                    {value: "02", name: "军官证"},
                    {value: "03", name: "护照"},
                    {value: "04", name: "户口簿"},
                    {value: "05", name: "士兵证"},
                    {value: "06", name: "港澳来往内地通行证"},
                    {value: "07", name: "台湾同胞来往内地通行证"},
                    {value: "08", name: "临时身份证"},
                    {value: "09", name: "外国人居留证"},
                    {value: "10", name: "警官证"},
                    {value: "99", name: "其他"},
                ],
                profitRuleList: [
                    {value: '00', name: '全产品统一分润'},
                    {value: '01', name: '业务产品分润'}
                ],
                profitInputModeALLList: [{value: '01', name: '固定金额'}, {value: '02', name: '商户手续费千分比'}, {
                    value: '03',
                    name: '成本差额千分比'
                }],
                settleTypeList: [{value: 'D0', name: 'D+0清算'},
                    {value: 'T1', name: 'T+1清算'},
                    {value: 'TN', name: 'T+N清算'},
                    {value: 'MT', name: '按月清算'},
                    {value: 'ST', name: '按季清算'},],
                settleAcctTypeList: [
                    {value: '00', name: '本行借记账户'},
                    {value: '01', name: '本行贷记账户'},
                    {value: '02', name: '本行存折'},
                    {value: '03', name: '本行内部户'},
                    {value: '10', name: '他行借记账户'},
                    {value: '11', name: '他行贷记账户'},
                    {value: '12', name: '他行存折'},
                    {value: '13', name: '他行内部户'}
                ],
                acctOpenBankNoList: [],
                feeCdList: [],
            };
        },
        methods: {
            handleChange(value, param) {
                this.beanInfo[param] = value;
            },
            async submit() {
                let res;
                switch (this.operatorType) {
                    case "add":
                        res = await this.edit();
                        break;
                    case "edit":
                        res = await this.edit();
                        break;
                    case "stop":
                        res = await this.edit();
                        break;
                    case "use":
                        res = await this.edit();
                        break;
                    case "cancel":
                        res = await this.edit();
                        break;
                    case "view":
                        res = true;
                        break;
                    default:
                        break;
                }
                return res;
            },
            async edit() {
                const res = await this.$refs.form.validate();
                if (res) {
                    let optFlag = {
                        add: `add`,
                        edit: `upd`,
                        view: `view`,
                        use: `use`,
                        stop: `stop`,
                        cancel: `cancel`
                    }[this.operatorType]
                    const params = {
                        ...this.beanInfo,
                        optFlag: optFlag,
                    };
                    if (optFlag === 'stop') {
                        params.stopReason = this.beanInfo.stopReason
                    }
                    if (optFlag === 'cancel') {
                        params.cancelReason = this.beanInfo.cancelReason
                    }
                    const res = await this.$post("/admin/merParam/agentInfo/edit", params);
                    if (res.status === 200) {
                        this.$message.success("保存成功！");
                        return true;
                    } else {
                        this.$message.error(res.data.message);
                        return false;
                    }
                }
            },
            resetFields() {
                return this.$refs.form && this.$refs.form.resetFields();
            },
            setOperatorType(type) {
                this.operatorType = type;
            },
            async setBeanInfo({...beanInfo}, instId) {
                this.beanInfo = beanInfo;
                this.instId = instId
                await this.getOne();
                await this.getFeeCdList();
                await this.getBankNameCode();
            },
            async getOne() {
                try {
                    let optFlag = {
                        add: `add`,
                        edit: `upd`,
                        view: `view`,
                        use: `use`,
                        stop: `stop`,
                        cancel: `cancel`
                    }[this.operatorType]
                    const param = {
                        instId: this.instId,
                        optFlag: optFlag,
                    }
                    if (optFlag !== 'add') {
                        param.id = this.beanInfo.id
                    }
                    const res = await this.$get("/admin/merParam/agentInfo/edit", param);
                    this.beanInfo = res.data.entity || {};
                    this.baseProdProfitConfListMap = res.data.baseProdProfitConfListMap || {};
                } catch (e) {
                    console.error(e);
                }
            },
            baseProdProfitConfListMapChange() {

            },
            async getFeeCdList() {
                const res = await this.$get("/admin/merParam/agentInfo/feeCdSelect2List", {
                    q: encodeURIComponent(`&${this.instId}`),
                });
                if (res.status === 200) {
                    this.feeCdList = res.data.results.map(i => {
                        i.value = i.id
                        return i
                    })
                }
            },
            async getBankNameCode(val = '') {
                const res = await this.$get("/admin/mcmp/bMchntBaseInfo/bankNameCodeQuerySelect2List", {
                    q: encodeURIComponent(val + `&${this.instId}`),
                });
                if (res.status === 200) {
                    this.acctOpenBankNoList = res.data.results.map(i => {
                        i.name = i.id + ' - ' + i.name
                        i.value = i.id
                        return i
                    })
                }
            },

            bankNoChange(value) {
                this.$set(this.beanInfo, 'acctOpenBankNo', value)
                this.$set(this.beanInfo, 'acctOpenBankName', (this.acctOpenBankNoList.filter(i => {
                    return i.id === value
                }))[0].name.split("-")[1])
            },
        },
    };
</script>

<style lang="less" scoped>
  @import "../../../../../static/less/Common";

  .subtitle {
    width: 100%;
    font-size: 18px;
    margin-bottom: 10px;
  }

  .sub-content-flex {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
  }

  .sub-content-block {
    display: block;
    flex-wrap: wrap;
    width: 100%;
  }
</style>
